// 全局前置守卫
import router from '@/router'
import store from '@/store'
import { asyncRoutes } from '@/router/asyncRoutes'
const whitePage = ['/login', '/404']
// 获取一级权限标识
function getFirstRoutePermission(permissions) {
  const firstPermArr = permissions.map(item => {
    return item.split(':')[0]
  })
  // console.log(firstPermArr)
  // 对已经分割的一级权限进行去重复处理 1，可以使用filter便利函数处理
  // 或则set函数，set函数不能存储重复数据，但是让不是一个真实的数组
  // 将他转成一个真实的数组
  return Array.from(new Set(firstPermArr))
}
// 获取二级权限标识
function getSecondRoutePermission(permissions) {
  // 分割权限标识，得到二级权限标识
  const secondPermArr = permissions.map(item => {
    const arr = item.split(':')
    return `${arr[0]}:${arr[1]}`
  })

  return Array.from(new Set(secondPermArr))
}
// 根据一二级权限标识，筛选出对应和展示的动态路由
function getRoutes(firstPermission, secondPermission, asyncRoutes) {
  // 判断当前登录人员是不是管理员，如果是的话，就不进行筛选了
  if (firstPermission.includes('*')) return asyncRoutes
  // 使用filter()筛选动态路由，并利用map()方法提取权限标识
  const firstRoutes = asyncRoutes.filter(item => firstPermission.includes(item.permission))
  // console.log(firstRoutes)
  const routes = firstRoutes.map(item => {
    return {
      ...item,
      children: item.children.filter(child => secondPermission.includes(child.permission))
    }
  })
  return routes
}
router.beforeEach(async(to, from, next) => {
  // to:跳转的路由对象
  // from：从哪里来
  // next：放行next() 重定向next(路径)
  const token = store.state.user.token
  if (token) {
    // 如果存在token，就放行
    // 存在token且要访问的界面为登陆界面
    if (to.path === '/login') {
      // 跳转到首页
      next('/')
    } else {
      // 如果跳转的界面不是登录界面，就正常放行就可以
      next()
      // 1.拿到用户的权限信息
      const permissions = await store.dispatch('menu/getPermission')
      // console.log(permissions)
      // 2.根据权限标识，筛选出对应的一级路由标识(在上面定义一个函数来书写)
      const firstPermission = getFirstRoutePermission(permissions)
      // console.log(firstPermission)
      // 3.根据权限标识，筛选出对应的二级路由标识
      const secondPermission = getSecondRoutePermission(permissions)
      // console.log(secondPermission)
      // 4.根据一级权限标识和二级权限标识和动态路由进行筛选
      // console.log(asyncRoutes)
      const routes = getRoutes(firstPermission, secondPermission, asyncRoutes)
      // console.log(routes)
      // 5.将筛选后的路由展示在左侧菜单中
      // route.addRoute：添加一条新的路由规则，如果要实现多条路由规则添加，进行便利即可
      routes.forEach(item => router.addRoute(item))
      // 5.1把删选之后的路由添加到vuex中（渲染）
      store.commit('menu/setMenuList', routes)
    }
  } else {
    // 如果不存在token,看跳转的界面是否在白名单界面，如果在，正常放行，如果不在，跳转到登录界面
    if (whitePage.includes(to.path)) {
      next()
    } else {
      next('/login')
    }
  }
})
